<template>
    <div class="movie-base column-center"
        @click.stop="toPage">
        <img :src="info.imgUrl"
            alt="">
        <div class="row ">
            <p>{{info.movieName}} <span class="orange-color">{{info.imgNumber}}</span></p>
        </div>
    </div>
</template>
<script>
export default {
    name: "movie-base",
    props: {
        info: {
            type: Object,
            required: true
        }
    },
    methods: {
        toPage() {
            this.$router.push({ path: "/film_details" })
        }
    }
}
</script>

<style lang="less" scoped>
    .movie-base {
        height: 200px;
        margin-left: 15px;
        margin-right: 15px;
        width: 115px;
        height: 210px;
    }
</style>
